@import url('assets/style/mixin.less');
.componentDemandPage {
  margin-top: 88px;
  .itemViews {
    flex-direction: row;
    padding: 15px 40px;
    .leftImg {
      width: 170px;
      height: 170px;
      margin-right: 20px;
      border-radius: 20px;
    }
    .rightBox {
      flex: 1;
      flex-direction: column;
      justify-content: space-between;
      .titleBox {
        flex-direction: row;
        margin-top: 5px;
        width: 64vw;
        .title {
          width: 60vw;
          font-size: 28px;
          color: #333333;
          line-height: 40px;
          .text-overflow(@lines: 1);
        }
        .badge {
          font-size: 20px;
          color: #eb6933;
          line-height: 28px;
          background-color: #fff3ec;
          padding: 6px;
          border-radius: 10px;
          overflow: hidden;
          margin-left: 20px;
        }
      }
      .descBox {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        .desc {
          font-size: 20px;
          color: #999999;
          line-height: 28px;
        }
        .km {
          font-size: 24px;
          color: #999999;
          line-height: 34px;
        }
      }
      .bottomBox {
        flex-direction: row;
        justify-content: space-between;
        .left {
          flex: 1;
          .priceBox {
            flex-direction: row;
            align-items: center;
            margin-bottom: 10px;
            .price {
              font-size: 24px;
              color: #ff6101;
              line-height: 28px;
              margin-right: 12px;
            }
            .discounts {
              font-size: 20px;
              color: #ff6101;
              border: 1px solid #ff6101;
              padding: 0 4px;
              border-radius: 5px;
              margin-right: 10px;
            }
            .oldPrice {
              font-size: 20px;
              color: #999999;
              line-height: 28px;
              text-decoration: line-through;
            }
          }
          .row {
            flex-direction: row;
            .logoImg {
              width: 28px;
              height: 28px;
            }
            .name {
              width: 40vw;
              font-size: 20px;
              color: #999999;
              line-height: 28px;
              margin-left: 5px;
              .text-overflow(@lines: 1);
            }
          }
        }
        .right {
          flex-direction: row;
          align-items: flex-end;
          justify-content: flex-end;
          .btn {
            padding: 15px 40px;
            border-radius: 40px;
            font-size: 26px;
            color: #ffffff;
            line-height: 38px;
            background-color: #ed6834;
          }
        }
      }
    }
  }

  .status {
    font-size: 24px;
    color: #999;
    text-align: center;
    margin-bottom: 30px;
    padding-bottom: env(safe-area-inset-bottom);
  }
}
